<!DOCTYPE html>
<html lang="en">

<head th:include="certificateWeb/headFoot :: headerCss">
</head>
<script>
    var _hmt = _hmt || [];
    (function () {
        var hm = document.createElement("script");
        hm.src = "https://hm.baidu.com/hm.js?093a8c24001a87f3d24cf2f6c52cd2e4";
        var s = document.getElementsByTagName("script")[0];
        s.parentNode.insertBefore(hm, s);
    })();
</script>
<!--<link href="/css/web/themes/about.css" rendpointel="stylesheet">-->
<link rel="stylesheet" href="/css/certificateWeb/homepage/homepage.css">
<style>
    .firstLine {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
</style>

<body id="body">
    <div th:include="certificateWeb/headFoot :: header"></div>

    <main id="main">
        <section class="se_1">
            <!--  轮播图  -->
            <div class="row  justify-content-md-center" style="width: 1200px;margin: 0 auto;">
                <div class="layui-carousel" id="banner" lay-filter="banner">
                    <div carousel-item=""></div>
                </div>
            </div>
        </section>
        <!--    &lt;!&ndash; 公告 &ndash;&gt;-->
        <!--    <section class="se_1">-->
        <!--    <div style="margin: 20px 0;border-bottom: 1px solid #efefef;">-->
        <!--        <ul>-->
        <!--            <div class="kctit" style="float: left"><span>通知公告：</span></div>-->
        <!--            <div style="float: left" class="layui-carousel" id="tz" lay-filter="tz">-->
        <!--                <div carousel-item="" id="tzc">-->

        <!--                </div>-->
        <!--            </div>-->
        <!--            <div class="clear"></div>-->
        <!--        </ul>-->
        <!--    </div>-->
        <!--    </section>-->
        <section class="se_1">

            <!-- <div class="title"><label>信息查询</label></div> -->
            <div class="title_box">
                <div style="color: #727272;">INFORMATION QUERY</div>
                <div style="color:#e70012">/</div>
                <div style="color:#232323">信息查询</div>
            </div>
            <ul class="certificate">
                <!-- <div   target="_blank">职业技能等级证书<font>证书查询</font></div> -->
                <a href="/certificate/certificateQuery">
                    <li class="li1" id="li1"></li>
                </a>
                
                <!-- <div class="xt"  target="_blank">职业技能等级证书<font>成绩查询</font></div> -->
                <a href="/certificate/gradeQuery">
                    <li class="l1" ></li>
                </a>
                <!-- <div class="xt"  target="_blank">职业技能等级证书<font>考点查询</font></div> -->
                <a href="/certificate/testingCentreQuery">
                    <li class="l2" ></li>
                </a>

                <!-- <div class="xt"  target="_blank">职业技能等级证书<font>专家查询</font></div> -->
                <a href="/certificate/expertQuery">
                    <li class="l3"></li>
                </a>

            </ul>
        </section>
        <section style="width:100%;background-color: #f4f4f4;">
            <div class="synopsis_box">
                <div class="title_box" style="margin: 0;">
                    <div style="color: #727272;">ABOUT US</div>
                    <div style="color:#e70012">/</div>
                    <div style="color:#232323">公司简介</div>
                </div>
                <div class="backg"></div>
                <div class="synopsis_txt">
                    <p>金职伟业研发中心设于北京，运营中心设于长沙，致力于构建立体化、全方位的现代家庭服务产业体系，帮助千万妇、幼、产实现健康幸福生活，着力打造全国一流的现代家庭服务产业生态智慧平台。</p>
                    <p>金职伟业目前已经形成标准研发、技能评价、人才培养、创业孵化及智慧平台五大核心业务板块，是1+x幼儿照护、产后恢复职业技能等级证书试点的职业教育培训评价组织，建设有成熟的家政、母婴、孕产、托育等职业技能提升课程体系，拥有超30项专项能力提升培训项目，服务于全国多省上百家母婴、家政托育、孕产服务机构及数十万行业从业人员。
                </div>
            </div>
            </div>
        </section>
        <section class="se_1">
            <div class="title_box">
                <div style="color: #727272;">POLICY INFORMATION</div>
                <div style="color:#e70012">/</div>
                <div style="color:#232323">政策信息</div>
            </div>
            <div class="policy_box">
                <div class="policy_img">
                    <img src="../../../img/tel.jpg" alt="">
                </div>
                <div class="policy_num">
                    <ul class="policys_num">
                        <li id="tab1" class="actives" onmouseover="tabClick(1)">01</li>
                        <li id="tab2" class="b2" onmouseover="tabClick(2)">02</li>
                        <li id="tab3" class="b3" onmouseover="tabClick(3)">03</li>
                        <li id="tab4" class="b4" onmouseover="tabClick(4)">04</li>
                    </ul>
                    <div class="more_box">
                        <a href="/certificate/policyInfo" style="display: flex;
                        flex-direction: column;"> <span>MORE</span>
                            <i class="downward"></i></a>
                    </div>
                </div>
                <div class="right" style="position: relative;">
                    <div id="new">
                        <div id="zc_image">
                        </div>

                    </div>
                    <div class="policy_title">
                        <span>政策聚焦</span>
                    </div>
                </div>
            </div>
            <!-- <div class="title"><label>政策信息</label><a href="/certificate/policyInfo" class="more">MORE</a></div> -->
            <!-- <div class="layui-row">
            <div class="left">
                <div class="box" id="zc">
                </div>
            </div>
        </div> -->
        </section>
        <section style="width:100%;background-color: #f4f4f4;margin-top: 50px;">
            <!-- <div class="title"><label>通知公告</label><a href="/certificate/noticeInfo" class="more">MORE</a></div> -->
            <div class="inform_box">
                <div class="title_box">
                    <div style="color: #727272;">THE ANNOUNCEMENT</div>
                    <div style="color:#e70012">/</div>
                    <div style="color:#232323">通知公告</div>
                </div>
                <div class="layui-row">
                    <div class="policys_box">
                        <div class="inform_left">
                            <div class="layui-carousel" id="new1">
                                <div carousel-item>
                                    <div th:each="tz:${consultations}">
                                        <a th:href="@{'/certificate/policyDetail?id='+${tz.id}}">
                                            <img th:src="${tz.thumbnail}">
                                            <p style="opacity:0"><label style="margin-bottom: 28px"
                                                    th:text="${tz.title}"></label></p>
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="inform_right">
                            <div class="box" id="tz">
                            </div>
                            <div style="position: absolute;bottom: -15%;right: 17%;">
                                <a href="/certificate/noticeInfo">
                                    <div class="titleMore">
                                        <div>MORE</div>
                                    </div>
                                </a>
                            </div>
                        </div>


                    </div>
                </div>
            </div>
        </section>

        <section class="se_1">
            <div class="title_box">
                <div style="color: #727272;">ELEGANT DEMEANOUR</div>
                <div style="color:#e70012">/</div>
                <div style="color:#232323">试点院校风采</div>
            </div>
            <!-- <div class="title"><label>试点院校风采</label><a href="/certificate/schoolMien" class="more">MORE</a></div> -->
            <!-- <div class="layui-row">
                <div class="left">
                    <div class="box" id="fc">
                    </div>
                </div>
                <div class="right">
                    <div class="layui-carousel" id="new3">
                        <div carousel-item>
                            <div th:each="tz:${consultations}">
                                <a th:href="@{'/certificate/policyDetail?id='+${tz.id}}">
                                    <img th:src="${tz.thumbnail}">
                                    <p><label style="margin-bottom: 28px" th:text="${tz.title}"></label></p>
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
            </div> -->
            <div class="informs_box">
                <div class="mien_box">
                  
                </div>
                <div style="position: absolute;bottom: -11%;right: 8%;">
                    <a href="/certificate/noticeInfo">
                        <div class="titleMore">
                            <div>MORE</div>
                        </div>
                    </a>
                </div>
                </div>
        </section>

        <section style="width:100%;background-color: #f4f4f4;margin: 50px 0;">
            <!-- <div class="title"><label>工作动态</label><a href="/certificate/tradeInfo" class="more">MORE</a></div> -->
            <div class="title_box" style="padding:20px 0">
                <div style="color: #727272;">DYNAMIC WORK</div>
                <div style="color:#e70012">/</div>
                <div style="color:#232323">工作动态</div>
            </div>
            <div class="work_dynamic">
                <div class="dotted_line"></div>
                <div class="work_time">
                </div>
                <div class="works_time" style="margin-top:50px;">
                </div>
            </div>
            <!-- <div class="layui-row">
                <div class="left">
                    <div class="box" id="gz">
                    </div>
                </div>
                <div class="right">
                    <div class="layui-carousel" id="new2">
                        <div carousel-item>
                            <div th:each="tz:${consultations}">
                                <a th:href="@{'/certificate/policyDetail?id='+${tz.id}}">
                                    <img th:src="${tz.thumbnail}">
                                    <p><label style="margin-bottom: 28px" th:text="${tz.title}"></label></p>
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
            </div> -->
        </section>

        <section class="se_1">
            <!-- <div class="title"><label>招聘信息</label><a href="/cultivate/getRecruit" target="_blank" class="more">MORE</a> -->
            <!-- </div> -->
            <div class="title_box">
                <div style="color: #727272;">RECRUITMENT INFORMATION</div>
                <div style="color:#e70012">/</div>
                <div style="color:#232323">招聘信息</div>
            </div>
            <div class="layui-row">
                <div id="job" style="width: 1200px;margin-left: 4%;">
                </div>
            </div>
        </section>
        <section class="se_1">
            <!--        <div class="title"><label>相关入口</label></div>-->
            <a href="/cultivate/getRecruit">
                <div class="titleMore">
                    <div>MORE</div>
                </div>
            </a>
            <ul class="inser">
                <li>
                    <a class="bm"></a>
                </li>
                <li>
                    <a href="/login" class="kw" target="_blank"></a>
                </li>
                <li>
                    <a href="https://peixun.jz1x.com/" class="px" target="_blank"></a>
                </li>
                <li id="ks"></li>
            </ul>
        </section>
    </main>

    <DIV id=move_port class="ygbk" style="Z-INDEX: 100; LEFT: 2px; WIDTH: 260px; POSITION: absolute; TOP: 43px; HEIGHT: auto;border:1px solid #efefef;background-color:#efefef;
 visibility: visible;"></DIV>

    <div th:include="certificateWeb/headFoot :: footer"></div>
</body>
<script src="/lib/jquery/jquery.min.js"></script>
<script src="/js/move.js"></script>
<script>
    var selectedList = [null, null, null, null, null, null];
    $(function () {
        $(".bm").click(function () {
            layer.msg("入口已关闭");
        });
        $.ajax({
            url: "/jzApi/recruitment/selJobList",
            type: 'GET',
            data: {
                name: '',
                type: 0,
                number: 6,
                current: 1,
                city: selectedList[0],
                experience: selectedList[1],
                education: selectedList[2],
                scale: selectedList[3],
                postName: selectedList[4],
                requirement: selectedList[5],
            },
            success: function (res) {
                if (res.data.pages == 0) {
                    $("#job").html('<div class="noData">暂无数据</div>');
                } else {
                    var list = res.data.records;
                    var job = '';
                    list.forEach(function (item, index) {
                        job += '<ul onmouseover="frame()" class="frame">' +
                            '<li style="width:100%;height: 85px">' +
                            '<a href="/cultivate/recruitInfo?id=' + item.id + '" target="_blank">' +
                            '<div style="text-align: center;float: left;margin-right: 10px"><img style="width:80px;height:85px;" src="' + item.thumbnail + '" alt="图片"></div>' +
                            '<div style="display:flex;flex-direction: column;">' +
                            '<span style="display:inline-block;font-size: 20px;font-weight: bold;color:#e70012">' + item.orgName + '</span>' +
                            // '<span class="firstLine" style="width:255px;display:inline-block;margin:5px auto;font-size: 14px;color: #666666">'  + item.workExperience +'</span>' +
                            '<span class="firstLine" style="font-weight:bold;width:100%;display:inline-block;font-size: 14px;">' + item.welfareInroduce + '</span>' +
                            '<span class="firstLine" style="color:#e70012;font-weight:bold;width:100%;display:inline-block;font-size: 18px;">' + item.salaryRange + '</span>' +
                            '</div>' +
                            '</a>' +
                            '</li><div style="clear: both"></div></ul>'

                    });
                    $("#job").html(job);
                }
            }
        });
        $.ajax({
            url: "/jzApi/index/selNewsList",
            type: 'GET',
            data: {
                firstColumn: '证书考试门户',
                columnName: '考试须知',
                current: 1,
                number: 1
            },
            success: function (res) {
                if (res.data.pages == 0) {
                    $("#news").html('<div class="noData">暂无数据</div>');
                } else {
                    var list = res.data.records;
                    var news = '';
                    list.forEach(function (item, index) {
                        news += '<a href="' + item.files + '" class="xz"  target="_blank"></a>'
                    });
                    $("#ks").html(news);
                }
            }
        });

        //浮动窗口
        $.ajax({
            url: "/jzApi/index/selNewsList",
            type: 'GET',
            data: {
                firstColumn: '证书考试门户',
                columnName: '漂浮公告',
                current: 1,
                number: 1
            },
            success: function (res) {
                if (res.data.pages == 0) {
                    $("#move_port").hide();
                    //$("#move_port").html('<center><p>暂无公告</p></center>');
                } else {
                    var list = res.data.records;
                    var news = '<div class="kctit clear kctit1"><center><span class="kctit1" style="color:#fff">通知</span></center></div><div class="wenzhang" style="height:auto">';
                    list.forEach(function (item, index) {
                        news +=
                            '<a href="/certificate/policyDetail?&id=' + item.id + '" target="_blank">' +
                            '<span style="font-size:18px">' + item.title + '</span></a>'
                    });
                    news += "</div>"
                    $("#move_port").html(news);
                }
            }
        });

        //成绩查询
        $("#find").click(function () {
            $.ajax({
                type: "get",
                url: '/certificate/gradeQuery',
                success: function (r) {
                    if (r.code == 10000) {
                        location.href = '/certificate/loginWeb';
                    } else {
                        location.href = '/certificate/gradeQuery ';
                    }
                }
            })
        })
    });
    //banner轮播
    layui.use(['carousel', 'form'], function () {
        var carousel = layui.carousel;
        $.ajax({
            url: "/jzApi/index/selBanners",
            type: 'GET',
            success: function (res) {
                var list = res.data;
                var banners = '';
                list.forEach(function (item, index) {
                    banners += '<div><img src="' + item.value + '" style="height:400px;margin:auto"></div>';
                });
                $("#banner").children('div').html(banners);
                var ins = carousel.render({
                    elem: '#banner',
                    arrow: 'always',
                    width: '100%', //设置容器宽度
                    height: '400px',
                    anim: 'fade' //轮播切换动画方式
                });
                ins.reload({ elem: '#banner' });
            }
        });
        //通知列表
        $.ajax({
            url: "/jzApi/index/selNewsList",
            type: 'GET',
            data: {
                firstColumn: '培训就业门户',
                columnName: '通知公告',
                current: 1,
                number: 5
            },
            success: function (res) {
                if (res.data.pages == 0) {
                    $("#news").html('<div class="noData">暂无数据</div>');
                } else {
                    var list = res.data.records;
                    var news = '';
                    list.forEach(function (item, index) {
                        news += '<li class="clone" style="background: #fff">' +
                            '<a href="/notice/newsInfo?name=通知公告&id=' + item.id + '" target="_blank">' +
                            '<span style="font-size:18px">' + item.title + '</span></a></li>'
                    });
                    $("#tzc").html(news);
                }
                //通知公告
                carousel.render({
                    elem: '#tz',
                    arrow: 'none',
                    width: '90%', //设置容器宽度
                    anim: 'updown', //轮播切换动画方式
                    height: '40px',
                    indicator: 'none'
                });
            }
        });
        getData(carousel, '政策信息', '#zc', '#new');
        getData(carousel, '通知公告', '#tz', '#new1');
        getData(carousel, '工作动态', '#gz', '#new2');
        getData(carousel, '试点院校风采', '#fc', '#new3');

    });

    function getData(carousel, columnName, textId, imageId) {
        //左边列表
        $.ajax({
            url: "/jzApi/index/selNewsList",
            type: 'GET',
            data: {
                firstColumn: '证书考试门户',
                columnName: columnName,
                current: 1,
                number: 5
            },
            success: function (res) {
                if (res.data.pages == 0) {
                    $(textId).html('<div class="noData">暂无数据</div>');
                } else {
                    var list = res.data.records;
                    var news = '';
                    list.forEach(function (item, index) {
                        var a = '';
                        if (item.thumbnail == '') {
                            a = '<img src="/img/word.png" />';
                        } else {
                            a = '<img src="' + item.thumbnail + '">';
                        }

                        var b = '';
                        if (item.istop == 1) {
                            b = '<span class="top">🔝置顶</span>';
                        }
                        news += '<div class="list">' +
                            a +
                            '<label>' + item.createrDate.substring(0, 10) + '</label>' +
                            '<a href="/certificate/policyDetail?id=' + item.id + '" target="_blank">' + b + item.title + '</a>' +
                            '</div>';
                    });
                    $(textId).html(news);
                }
            }
        });
        //右边缩略图
        $.ajax({
            url: "/jzApi/index/selNewsThumbnailList",
            type: 'GET',
            data: {
                firstColumn: '证书考试门户',
                columnName: columnName,
                current: 1,
                number: 4
            },
            success: function (res) {
                if (columnName == '试点院校风采') {
                    if (res.data.pages == 0) {
                        $(imageId).html('<div class="noData">暂无数据</div>');
                    } else {
                        var records = JSON.stringify(res.data.records);
                        var record = JSON.parse(records)
                        var academys = 
                            ' <div class="academy_box">' +
                            '  <div class="academys_txt">' +
                            '<p>' + record[0].title + '</p>' +

                            ' <a  href="/certificate/policyDetail?id=' + record[0].id + '">' +
                            ' <div class="details">' +

                            '       <span>' + "查看詳情→" + '</span>' +
                            '  </div>' +
                            '</a>' +
                            ' </div>' +
                            '  <div class="academy_img">' +
                            '<img src="' + record[0].thumbnail + '" style="height:100%">' +
                            '  </div>' +
                            '  </div>' +
                            ' <div class="academy_box">' +
                            '  <div class="academys_txt">' +
                            '<p>' + record[1].title + '</p>' +

                            ' <a  href="/certificate/policyDetail?id=' + record[1].id + '">' +
                            ' <div class="details">' +

                            '       <span>' + "查看詳情→" + '</span>' +
                            '  </div>' +
                            '</a>' +
                            ' </div>' +
                            '  <div class="academy_img">' +
                            '<img src="' + record[1].thumbnail + '" style="height:100%">' +
                            '  </div>' +
                            '  </div>' +
                            '    <div class="academy">' +

                            '   <div class="academy_img">' +
                            '<img src="' + record[2].thumbnail + '">' +
                            '     </div>' +
                            '  <div class="academys_txt">' +
                            '<p>' + record[2].title + '</p>' +
                            ' <a  href="/certificate/policyDetail?id=' + record[2].id + '">' +
                            ' <div class="details">' +

                            '       <span>' + "查看詳情→" + '</span>' +
                            '  </div>' +
                            '</a>' +
                            ' </div>' +
                            ' </div>' +
                            '  <div class="academy">' +

                            '   <div class="academy_img">' + '<img src="' + record[3].thumbnail + '">' +
                            '  </div>' +
                            '<div class="academys_txt">' +

                            '<p>' + record[3].title + '</p>' +
                            ' <a  href="/certificate/policyDetail?id=' + record[3].id + '">' +
                            ' <div class="details">' +

                            '       <span>' + "查看詳情→" + '</span>' +
                            '  </div>' +
                            '</a>' +
                            ' </div>' +
                            ' </div>' +
                            '</div>'
                        $(".mien_box").html(academys);
                        // $('.q_txt').mouseenter(function(){
                        //     $('.q_txt p').css('color','#fff');
                        //     $('.q_txt .details').css('border','2px solid #fff');
                        //     $('.q_txt .details span').css('color','#fff');
                        // })
                    }
                }
                if (columnName == '工作动态') {
                    if (res.data.pages == 0) {
                        $(imageId).html('<div class="noData">暂无数据</div>');
                    } else {
                        var lists = res.data.records;
                        var work_time = '';
                        var work_img = '';
                        lists.forEach(function (item, index) {
                            var a = '';
                            work_time += '<div class="time_box">' +
                                '<span>' + item.createrDate.substring(0, 10) + '</span>' +
                                '<div class="node">' + '</div>' +
                                '</div>';
                            work_img +=
                                '<div class="work_img">' +
                                '<img src="' + item.thumbnail + '">' +
                                '<p style="margin-top:10px;color:#696969">' + item.title + '</p>' +
                                // '<div class="overlay">'+'</div>'+
                                ' <a href="/certificate/policyDetail?id=' + item.id + '">' +
                            ' <div class="hade_node">' +

                            '       <span>' + "DETAILS" + '</span>' +
                            '  </div>' +
                                '</div>';
                        })
                        $('.work_time').html(work_time);
                        $('.works_time').html(work_img);
                        $(".work_img").mouseenter(function () {
                            var index = $(this).index()
                            $(".work_img p").eq(index).css('color', '#e50112')
                            $('.time_box').eq(index).css('background','#e50112')
                            $('.hade_node').eq(index).css('background','#e50112')
                            $('.time_box span').eq(index).css('color','#fff')
                            $('.node').eq(index).css('background','#e50112')

                        });
                        $(".work_img").mouseleave(function () {
                            var index = $(this).index()
                            $(".work_img p").eq(index).css('color', '#696969')
                            $('.node').eq(index).css('background','#bfbfbf')
                            $('.time_box').eq(index).css('background','#f4f4f4')
                            $('.time_box span').eq(index).css('color','#696969')
                            $('.hade_node').css('background','#636363');

                        });
                    }
                }
                else if(columnName == '通知公告'){
                    if (res.data.pages == 0) {
                        $(imageId).html('<div class="noData">暂无数据</div>');
                    } else {
                        var list = res.data.records;
                        var zcImage = '';
                        list.forEach(function (item, index) {
                            var a = '';
                            zcImage += '<div id="myId_' + index + '" class="items" style="height:100%"><a  href="/certificate/policyDetail?id=' + item.id + '">' +
                                '<img src="' + item.thumbnail + '">' +
                                // '<p style="margin-top:40px"><label style="margin-bottom:28px;color:#e70012">' + item.title + '</label></p>' +
                                '</a></div>'
                        });
                        $(imageId).children('div').html(zcImage);
                        carousel.render({
                            elem: imageId,
                            arrow: 'always',
                            width: '100%',
                            height: '305px',
                            anim: 'fade',
                            indicator: 'none'
                        });
                    }
                }
                else {
                    if (res.data.pages == 0) {
                        $(imageId).html('<div class="noData">暂无数据</div>');
                    } else {
                        var list = res.data.records;
                        var zcImage = '';
                        list.forEach(function (item, index) {
                            var a = '';
                            zcImage += '<div id="myId_' + index + '" class="items" style="display:none"><a  href="/certificate/policyDetail?id=' + item.id + '">' +
                                '<img src="' + item.thumbnail + '">' +
                                '<p style="margin-top:40px"><label style="margin-bottom:28px;color:#e70012">' + item.title + '</label></p>' +
                                '</a></div>'
                        });
                        $(imageId).children('div').html(zcImage);
                        carousel.render({
                            elem: imageId,
                            arrow: 'always',
                            width: '100%',
                            height: '305px',
                            anim: 'fade',
                            indicator: 'none'
                        });
                    }
                    document.getElementById("myId_0").style.display = "block";

                }

            }

        });
    }

    function message() {
        // var work_time = document.querySelector('.work_time');
        // var works = document.querySelector('.time_box')
        // var span = work_time.querySelectorAll('span')
        // var work_img = document.querySelector('.work_img');
        // var images = work_img.querySelectorAll('img')
        // var p = work_img.querySelectorAll('p')
        // for (var i = 0; i < works.length; i++) {
        //     var index = i;
        //     console.log(index)
        //     if (i == index) {
        //         works[i].style.background = "#e50112"
                // span[i].style.color = "#fff";
                // images.style.opacity = "1";
                // p.style.color = "#e50112";
            // } else {
                // works[i].style.background = "#bfbfbf"
                // span[i].style.color = "#bfbfbf";
                // images.style.opacity = "0.6";
                // p.style.color = "#bfbfbf";
            // }

        // }

    }

    function frame() {
        var ul = document.querySelector('.frame')
        for (var i = 0; i < ul.length; i++) {
            ul[i].className = "frames"
        }
    }
    function tabClick(index) {
        var tab_list = document.querySelector('.policy_num');
        var lis = tab_list.querySelectorAll('li');
        var items = document.querySelectorAll('.items');
        for (var i = 0; i < lis.length; i++) {
            if ((i + 1) == index) {
                lis[i].className = "actives";
                items[i].style.display = 'block';
            } else {
                lis[i].className = "b" + (i + 1);
                items[i].style.display = 'none';
            }
        }
    }
</script>

</html>